<script setup>
	import { onLoad } from '@dcloudio/uni-app'
	import { ref } from 'vue'
	import { useUserStore } from '@/store/user'
	
	const config = getApp().globalData.config
	const user = useUserStore()
	
	function openPage(url) {
		if(url) uni.navigateTo({url})
		else uni.showToast({icon: 'none',title: '敬请期待！'})
	}
	function viewAgreement() {
		uni.navigateTo({
			url: '/pages/user/protocolConsumer'
		})
		// let site = config.appInfo.agreements[1]
		// uni.navigateTo({
		// 	url: `/pages/webview?title=${site.title}&url=${site.url}`
		// })
	}
	function viewPrivacy() {
		uni.navigateTo({
			url: '/pages/user/protocolPrivacy'
		})
		// let site = config.appInfo.agreements[0]
		// uni.navigateTo({
		// 	url: `/pages/webview?title=${site.title}&url=${site.url}`
		// })
	}
	function logout() {
		uni.showModal({
			title: '提示',
			content: '确定退出系统吗？',
			success: (res) => {
				if (res.confirm) {
					user.logOutAction().then(res => {
						uni.redirectTo({url: '/pages/login'})
					})
				}
			}
		})
	}
	onLoad(() => {
	 
	})
</script>

<template>
	<view class="app-container">
		<view class="app-content">
			<view class="func-nav" @click="openPage('/pages/user/info?delta=1')">
				<text>账户设置</text>
				<uv-icon name="arrow-right" color="#54504D" size="30" bold />
			</view>
			<view class="func-nav" @click="viewPrivacy">
				<text>隐私政策</text>
				<uv-icon name="arrow-right" color="#54504D" size="30" bold />
			</view>
			<view class="func-nav" @click="viewAgreement">
				<text>用户协议</text>
				<uv-icon name="arrow-right" color="#54504D" size="30" bold />
			</view>
			<view class="func-nav" @click="openPage('/pages/user/about')">
				<text>关于我们</text>
				<uv-icon name="arrow-right" color="#54504D" size="30" bold />
			</view>
		</view>
		<view class="app-bottom">
			<uv-button color="#FF3E49" text="退出登陆" :custom-style="{width: '260rpx'}" @click="logout"></uv-button>
		</view>
	</view>
</template>

<style lang="scss" scoped>
	.app-container{
		padding-bottom: 200rpx;
		.app-content{
			margin: 24rpx 24rpx 0 24rpx;
			padding: 0 24rpx;
			background-color: #FFFFFF;
			border-radius: 24rpx;
			.func-nav{
				padding: 24rpx 0;
				display: flex;
				justify-content: space-between;
				align-items: center;
			}
			.func-nav + .func-nav {
				border-top: 2rpx solid #D7DBE1;
			}
		}
		.app-bottom{
			position: fixed;
			left: 0;
			right: 0;
			bottom: 100rpx;
			display: flex;
			justify-content: center;
			
		}
	}
</style>